feat: Implement email OTP authentication #2414

HarshMN2345 · 2025-09-28T17:08:07Z

What does this PR do?

Add email OTP as primary login method with separate verification page,
proper Appwrite SDK integration, and dynamic UI switching.

Test Plan

Related PRs and Issues

(If this PR is related to any other PR or resolves any issue or related to any issue link all related PR and issues here.)

Have you read the Contributing Guidelines on issues?

yes

Summary by CodeRabbit

New Features
- Passwordless sign-in via email one-time code, plus a dedicated OTP verification page with resend capability.
- Persistent resend cooldown component for resend behavior.
UX Changes
- Button label adapts to sign-in mode; password now optional; email input no longer autofocus.
Reliability
- Improved notifications and error handling during send/verify flows; safer redirects when params are missing.

appwrite · 2025-09-28T17:08:11Z

Console

Project ID: 688b7bf400350cbd60e9

Sites (2)

Site	Status	Logs	Preview	QR
console-stage `688b7cf6003b1842c9dc`	Ready	View Logs	Preview URL
console-cloud `688b7c18002b9b871a8f`	Ready	View Logs	Preview URL

Note

Appwrite has a Discord community with over 16 000 members.

coderabbitai · 2025-09-28T17:08:16Z

Walkthrough

Adds a passwordless email OTP sign-in flow and a resend cooldown component. The login page now toggles between password login and sending an email sign-in code; password input is not required and email autofocus removed. A new email-otp page verifies 6-digit codes, creates console sessions, supports resending tokens, tracks analytics, shows notifications, and redirects based on coupon, campaign, or explicit redirect. A load function fetches coupon/campaign data from URL params. The send-verification modal was refactored to use a new ResendCooldown component with localStorage persistence.

Possibly related PRs

feat: added modal for email verfication #2354: Modifies src/lib/components/account/sendVerificationEmailModal.svelte and touches email verification/resend UI/logic — strong overlap in same component.
feat: implement email verification flow with route guard and modal #2398: Also changes sendVerificationEmailModal.svelte’s resend flow; this PR replaces the inline timer with the new ResendCooldown component.

Suggested reviewers

stnguyen90
ItzNotABug

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The title succinctly describes the main feature being added—email OTP authentication—and aligns with the changes in the PR by highlighting the new email-based OTP login flow without unnecessary detail.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch feat-SER-191-Implement-Email-OTP-Flow

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9e3b6c5 and efed2cc.

📒 Files selected for processing (3)

src/routes/(public)/(guest)/login/+page.svelte (2 hunks)
src/routes/(public)/(guest)/login/email-otp/+page.svelte (1 hunks)
src/routes/(public)/(guest)/login/email-otp/+page.ts (1 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

src/routes/(public)/(guest)/login/email-otp/+page.ts (1)

src/lib/stores/sdk.ts (1)

sdk (147-170)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

GitHub Check: e2e
GitHub Check: build

coderabbitai · 2025-09-28T17:15:17Z

src/routes/(public)/(guest)/login/+page.svelte

+                `${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}`
+            );


⚠️ Potential issue | 🟠 Major

Preserve existing query params when switching to the OTP flow

Right now we build the OTP URL with only email and userId, which strips any pre-existing query params (code, campaign, redirect, etc.). The new loader in email-otp/+page.ts expects those params to rehydrate data, so dropping them prevents us from ever hitting the coupon/campaign apply-credit paths and also loses any redirect target after a successful OTP login. Please carry forward the current search params before adding email/userId.

- await goto( - `${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}` - ); + const params = new URLSearchParams(window.location.search); + params.set('email', mail); + params.set('userId', sessionToken.userId); + + await goto(`${base}/login/email-otp?${params.toString()}`);

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

`${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}`

);

const params = new URLSearchParams(window.location.search);

params.set('email', mail);

params.set('userId', sessionToken.userId);

await goto(`${base}/login/email-otp?${params.toString()}`);

🤖 Prompt for AI Agents

In src/routes/(public)/(guest)/login/+page.svelte around lines 34 to 35, the OTP redirect builds a URL with only email and userId which drops any existing query params (code, campaign, redirect, etc.); update the URL construction to preserve current search params by copying the existing location.search (or current URLSearchParams) into a new URLSearchParams instance, set/overwrite the email and userId keys, and then append that full query string to `${base}/login/email-otp` so all original params are carried forward along with email and userId.

…t-Email-OTP-Flow

coderabbitai

Actionable comments posted: 1

🧹 Nitpick comments (1)

src/lib/components/account/sendVerificationEmailModal.svelte (1)
12-57: Drop the no-op onDestroy.

We still import onDestroy but only call an empty handler, so both lines can go. Keeps the component leaner.
-import { onDestroy } from 'svelte';
...
-onDestroy(() => {});

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between efed2cc and 32180c5.

📒 Files selected for processing (3)

src/lib/components/account/sendVerificationEmailModal.svelte (3 hunks)
src/lib/components/resendCooldown.svelte (1 hunks)
src/routes/(public)/(guest)/login/email-otp/+page.svelte (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

GitHub Check: build
GitHub Check: e2e

src/lib/components/resendCooldown.svelte

ItzNotABug · 2025-10-10T13:27:11Z

src/lib/components/account/sendVerificationEmailModal.svelte

-            localStorage.removeItem(EMAIL_SENT_KEY);
-        }
-    });
+    onDestroy(() => {});


ItzNotABug · 2025-10-10T13:27:45Z

src/lib/components/resendCooldown.svelte

+    import { Link } from '@appwrite.io/pink-svelte';
+
+    let {
+        storageKey = 'resend_cooldown_default',


lets not have a default, always mark as required.

ItzNotABug · 2025-10-10T13:28:53Z

src/routes/(public)/(guest)/login/email-otp/+page.svelte

svelte5 runes.

ItzNotABug · 2025-10-10T13:30:30Z

src/routes/(public)/(guest)/login/email-otp/+page.svelte

+        try {
+            disabled = true;
+            const sessionToken = await sdk.forConsole.account.createEmailToken({
+                userId: 'unique',


Use ID.unique()

feat: Implement email OTP authentication

efed2cc

HarshMN2345 self-assigned this Sep 28, 2025

coderabbitai bot reviewed Sep 28, 2025

View reviewed changes

HarshMN2345 added 2 commits October 10, 2025 12:31

Merge remote-tracking branch 'origin/main' into feat-SER-191-Implemen…

dde26a0

…t-Email-OTP-Flow

added timer to prevent abuse

32180c5

coderabbitai bot reviewed Oct 10, 2025

View reviewed changes

src/lib/components/resendCooldown.svelte Show resolved Hide resolved

HarshMN2345 requested a review from ItzNotABug October 10, 2025 08:18

ItzNotABug requested changes Oct 10, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: Implement email OTP authentication #2414

feat: Implement email OTP authentication #2414

Uh oh!

HarshMN2345 commented Sep 28, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

appwrite bot commented Sep 28, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Sep 28, 2025 •

edited

Loading

Uh oh!

coderabbitai bot left a comment

Uh oh!

coderabbitai bot Sep 28, 2025

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

ItzNotABug Oct 10, 2025

Uh oh!

ItzNotABug Oct 10, 2025

Uh oh!

ItzNotABug Oct 10, 2025

Uh oh!

ItzNotABug Oct 10, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		`${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}`
		);

-                `${base}/login/email-otp?email=${encodeURIComponent(mail)}&userId=${sessionToken.userId}`
-            );
+            const params = new URLSearchParams(window.location.search);
+            params.set('email', mail);
+            params.set('userId', sessionToken.userId);
+            await goto(`${base}/login/email-otp?${params.toString()}`);

feat: Implement email OTP authentication #2414

Are you sure you want to change the base?

feat: Implement email OTP authentication #2414

Uh oh!

Conversation

HarshMN2345 commented Sep 28, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What does this PR do?

Test Plan

Related PRs and Issues

Have you read the Contributing Guidelines on issues?

Summary by CodeRabbit

Uh oh!

appwrite bot commented Sep 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Console

Uh oh!

coderabbitai bot commented Sep 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Possibly related PRs

Suggested reviewers

Pre-merge checks and finishing touches

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

coderabbitai bot Sep 28, 2025

Choose a reason for hiding this comment

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

ItzNotABug Oct 10, 2025

Choose a reason for hiding this comment

Uh oh!

ItzNotABug Oct 10, 2025

Choose a reason for hiding this comment

Uh oh!

ItzNotABug Oct 10, 2025

Choose a reason for hiding this comment

Uh oh!

ItzNotABug Oct 10, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

HarshMN2345 commented Sep 28, 2025 •

edited by coderabbitai bot

Loading

appwrite bot commented Sep 28, 2025 •

edited

Loading

coderabbitai bot commented Sep 28, 2025 •

edited

Loading